<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/3/10
  Time: 20:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page isELIgnored="false" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
<head>
    <title>修改轮播图</title>
    <script type="text/javascript" charset="utf-8" src="${path}/webapp/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${path}/webapp/ueditor/ueditor.all.min.js"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="${path}/webapp/ueditor/lang/zh-cn/zh-cn.js"></script>

    <style type="text/css">
        div{
            width:100%;
        }zh-cn.js
    </style>
    <style>
        .parent{
            text-align: left;
            padding: 3% 5%;
        }
        /*.swiper_warp{*/
            /*margin: 3% 5%;*/
        /*}*/
        .title_text{
            font-weight: 600;
        }
        .swiper_warp input{
            width: 90%;
            height: 27px;
        }
        .swiper_time{
            display: inline-block;
        }
        .isEnable{

            font-size: 15px;
        }
        .swiper_warp{
            margin-bottom: 10px;
        }
        .swiper_time{
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
   <div class="parent">
       <div class="swiper_warp">
           <div class="title_text">活动标题</div>
           <div><input type="text" id="swiperName" value=""></div>
       </div>
       <div class="swiper_time" style="display: inline-block;width: 300px">
           <div class="title_text">封面图片</div>
           <input type="file" value="点击修改" id="image">
       </div>
       <div class="swiper_time" style="margin-left: 10%;display: inline-block;width: 300px">
           <div class="title_text">是否启用</div>
           <div><select id="isEnable" class="isEnable">

                   <option value="0" selected>已启用</option>
                   <option value="1">未启用</option>

           </select> </div>
       </div>

       <!-- 加载编辑器的容器 -->
       <script id="container" name="content" type="text/plain">
            ${swiper.swiperDetails}
       </script>
        <div><input type="button" value="提交" onclick="submission()">
        </div>
   </div>
<script type="text/javascript" src="${path}/webapp/js/jquery-3.1.1.js">

</script>
<!--加载富文本编辑器-->
   <script type="text/javascript">
       var ue = UE.getEditor('container');

       function submission(){
           var swiperName=$("#swiperName").val();
           var isEnable=$("#isEnable").val();
           var swiperDetails=ue.getContent();
           var format=new FormData();
           format.append("img",$("#image")[0].files[0]);
           format.append("swiperName",swiperName);
           format.append("isEnabled",isEnable);
           format.append("swiperDetails",swiperDetails);
           $.ajax({
               //几个参数需要注意一下
               type: "post",//方法类型
               url: "${path}/sys/swiper/addSwiper",//url
               data:format,
               dataType:"json",
               processData: false, // 告诉jQuery不要去处理发送的数据
               contentType: false, // 告诉jQuery不要去设置Content-Type请求头
               async:false,
               success: function (result) {

                   if("2"==result){
                       alert("封面请上传jpg格式图片");
                   }else if("0"==result){
                       alert("添加败");
                   }else if("1"==result){
                       alert("添加成功");
                       window.parent.loadHtml('${path}/sys/swiper/intoSwiper')
                       window.close();
                   }else {
                       alert(result)
                   }
               },
               error : function() {
                   alert("服务器忙");
               }
           })

       }
   </script>

</body>
</html>
